<!DOCTYPE html>
<!--
 *  Copyright (c) 2015 The WebRTC project authors. All Rights Reserved.
 *
 *  Use of this source code is governed by a BSD-style license
 *  that can be found in the LICENSE file in the root of the source
 *  tree.
-->
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1, maximum-scale=1">
  <meta id="theme-color" name="theme-color" content="#ffffff">
  <base target="_blank">
  <title>联信UMWebRTC视频演示-摄像头</title>
  <link rel="icon" href="./img/um.png">
  <link rel="stylesheet" href="./css/index.css">
  <script type="text/javascript" src="//static.runoob.com/assets/qrcode/qrcode.min.js"></script>
  <script>
    var videoBit = 240;
    // 选择清晰度
    function check(val) {
      videoBit = val;
    }
  </script>
</head>

<body>
  <div class="enter_box" id="enterBox">
    <div class="enter_fa">
      <div class="enter" id="enter_son">
        <div class="title" id="title">联信UMWebRTC·做世界最小最简便的视频服务器</div>
        <input class="room_num" id="roomInput" type="text" placeholder="请输入房间号" />
        <input type="password" class="room_num" id="roomPwd" placeholder="请输入房间密码">
        <input type="text" class="room_num" id="roomInfo" placeholder="请输入设备信息">
        <div class="definition">
          <input type="radio" id="d1" name="def" value="240" checked onclick="check(this.value)">
          <label for="d1">流畅</label>
          <input type="radio" id="d2" name="def" value="480" onclick="check(this.value)">
          <label for="d2">标清</label>
          <input type="radio" id="d3" name="def" value="720" onclick="check(this.value)">
          <label for="d3">高清</label>
        </div>
        <button class="join_btn" id="joinRoom">开始直播</button>
        <div class="create_box">
          <span class="createUrl" id="createURL">生成分享链接</span>
        </div>
        <div id="qrcodeBox">
          <div class="md5_qrcodeBox">
            <div class="tips" id="md5_tips">
            </div>
            <div id="md5_qrcode" class="md5_qrcode">
            </div>
          </div>
          <div class="name_pwd_qrcodeBox">
            <div class="tips another" id="name_pwd_tips"></div>
            <div id="name_pwd_qrcode" class="name_pwd_qrcode">
            </div>
          </div>
        </div>
        <div id="defaultQrcode">
        </div>
        <div id="defaultLink"></div>
      </div>
    </div>
  </div>
  <div class="box">
    <div id="local_video">
      <div class="video_box">
        <video id="local" autoplay playsinline muted></video>
      </div>
    </div>
  </div>
  <div class="function_list_box">
    <div class="function_list">
      <div class="showing">
        直播中（<span id="memberSum">0</span>）...
      </div>
      <ul class="function_ul">
        <li class="share" id="share">
          <span id="share_text" style="width: 100%;cursor: pointer;">分享</span>
          <div class="share_box" id="share_box" style="display: none;">
            <div class="share_link">
            </div>
            <div class="sanjiao_down1"></div>
          </div>
        </li>
        <li class="qrcode">
          <img src="./img/qrcode.png" alt="" id="qrcode">
          <div class="cl_big_qrcode" id="cl_big_qrcode" style="display: none;">
            <div class="click_qrcode" id="click_qrcode">
            </div>
            <div class="sanjiao_down"></div>
          </div>
        </li>
        <li class="control_audio" id="control_audio_box">
          <img src="./img/start_audio.png" alt="" id="control_audio">
        </li>
        <li class="control_video" id="control_video_box">
          <img src="./img/start_video.png" alt="" id="control_video">
        </li>
        <li class="exit">
          <button id="hungup">退出</button>
        </li>
      </ul>
    </div>
  </div>
</body>
<script src="./js/umvideo.min.js"></script>
<script src="./js/camera_room.js"></script>

</html>